import React from 'react';
import { ActionPositions } from './typings';
import { ActionItem } from './typings/ActionItem';
import { ColumnFieldBase } from './typings/ColumnFieldBase';
import { FormFieldBase } from './typings/FormFieldBase';
import { PipeItem } from './typings/Pipe';

type BlockValue = React.ReactNode | ((...args: any[]) => React.ReactNode) | null | undefined;

interface TuringManagerBase<T = any> {
  template?: string;
  renderTemplate?: (props: any) => React.ReactNode;
  customBlocks?: {
    [key: string]: BlockValue;
  };
  dataSource?: T[];
  rowKey?: string;
  loading?: boolean;
  actions?: ActionItem[];
  features?: { [key: string]: { [key: string]: any }};
  componentsMap: { [key: string]: (props: any) => React.ReactElement }
}

export type FieldConfig = {
  componentName:
    | 'EnumColumnField'
    | 'OperationColumnField'
    | 'TextColumnField'
    | 'LinkColumnField'
    | 'SelectFormField'
    | 'SearchSelectFormField'
    | 'RangeDatePickerFormField'
    | 'InputFormField'
    | 'DatePickerFormField'
    | string;
  label: string;
  name: string;
  value?: string;
  pipes?: PipeItem[];
  fixed?: 'left' | 'right';
  width?: string | number; // 字段显示宽度，table用
  validators?: any[]; // 参考 antd form rules
  position?: string; // Card 里面做分组
  actions?: ActionItem[]; // 操作列
  dataSource?: any[] | ((...args: any[]) => Promise<any[]>); // 数据源，支持函数是考虑联动场景
  deps?: []; // 依赖项
  [key: string]: any;
}

export type onChangeFunc = (
  event: {
    // 原始事件
    originalEvent?: any;
    action: string;
  },
  args: {
    pagination?: {
      pageSize?: number;
      current?: number;
      total?: number;
    };
    filterValues?: { [key: string]: any }; // 筛选
    filters?: { [key: string]: any[] }; // 表格内筛选
    sorter?: { sortField: string; sortOrder: 'asc' | 'desc' }[]; // 排序
  },
  extra?: {
    [key: string]: any;
  }
) => void;

export type ResourceManagerProps<T = any> = TuringManagerBase<T> & {
  template?: 'Table' | 'Card' | 'List'; // 内置模板类型，默认Table
  fields?: (FieldConfig & ColumnFieldBase)[]; // 为什么取 fields，而不是 columns？ 资源集合管理，而不是表格渲染

  pagination?: {
    current?: number; // 当前页码
    total?: number; // 总数
    pageSize?: number; // 分页 默认20
  };
  selectedRowKeys?: string[] | number[]; // 开启选择功能时，指定选中项的key 数组
  selectedRows?: { [key: string]: any }[];
  features?: {
    // 是否需要用这种复杂的结构？
    pagination?: {
      pageSizeList?: number[];
      showQuickJumper?: boolean;
      showTotal?: boolean;
    }
    // 开启选择功能
    rowSelection?: {
      type?: 'checkbox' | 'radio'; // 多选单选
      fixed?: boolean; // 把选择框列固定在左边
      infoRender?: (
        selectedRowKeys?: string[] | number[],
        selectedRows?: { [key: string]: any }[],
      ) => React.ReactNode; // 自定义信息区，暂时这么实现
      onChange: (selectedRowKeys?: string[] | number[], selectedRows?: object[]) => void;
    };
    filterProps?: {
      lazy?: boolean; // 筛选项立即生效，还是点筛选再生效
      light?: boolean; // 是否开启轻量筛选模式
      searchText?: string;
      resetText?: string;
      isShowResetButton?: boolean;
    };
    bordered?: boolean; // 展示边框
    size?: 'default' | 'middle' | 'small'; // 表格大小
  };
  title?: string;
  actions?: ActionItem<keyof typeof ActionPositions>[]; // actions的扩展区域
  filterFields?: (FieldConfig & FormFieldBase)[];
  filterValues?: object;

  onChange?: onChangeFunc;
}
